<div class="tab-sensors">
    <div class="content_wrapper">
        <div class="tab_title" i18n="tabRawSensorData"></div>
        <div class="cf_doc_version_bt">
            <a id="button-documentation" href="https://github.com/betaflight/betaflight/releases" target="_blank" rel="noopener noreferrer"></a>
        </div>

        <div class="note">
            <p i18n="sensorsInfo"></p>
        </div>
        <div class="gui_box">
            <div class="info">
                <div class="checkboxes">
                    <label><input type="checkbox" name="gyro_on" class="first" /><span i18n="sensorsGyroSelect"></span></label> <label><input
                        type="checkbox" name="accel_on" /><span i18n="sensorsAccelSelect"></span></label> <label><input type="checkbox"
                        name="mag_on" /><span i18n="sensorsMagSelect"></span></label> <label><input type="checkbox" name="altitude_on" /><span i18n="sensorsAltitudeSelect"></span></label> <label><input
                        type="checkbox" name="sonar_on" /><span i18n="sensorsSonarSelect"></span></label> <label><input type="checkbox" name="debug_on" /><span i18n="sensorsDebugSelect"></span></label>
                </div>
            </div>
        </div>
        <div class="wrapper gyro">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div class="title" i18n="sensorsGyroTitle"></div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="gyro_refresh_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50" selected="selected">50 ms</option>
                                <option value="100">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt i18n="sensorsScale"></dt>
                        <dd class="scale">
                            <select name="gyro_scale">
                                <option value="100">100</option>
                                <option value="500">500</option>
                                <option value="1000">1000</option>
                                <option value="2000" selected="selected">2000</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                        <dt>Y:</dt>
                        <dd class="y">0</dd>
                        <dt>Z:</dt>
                        <dd class="z">0</dd>
                    </dl>
                </div>
                <svg id="gyro">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
            </div>
        </div>
        <div class="wrapper accel">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div class="title" i18n="sensorsAccelTitle"></div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="accel_refresh_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50" selected="selected">50 ms</option>
                                <option value="100">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt i18n="sensorsScale"></dt>
                        <dd class="scale">
                            <select name="accel_scale">
                                <option value="0.5">0.5</option>
                                <option value="1">1</option>
                                <option value="2" selected="selected">2</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                        <dt>Y:</dt>
                        <dd class="y">0</dd>
                        <dt>Z:</dt>
                        <dd class="z">0</dd>
                    </dl>
                </div>
                <svg id="accel">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
            </div>
        </div>

        <div class="wrapper mag">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div class="title" i18n="sensorsMagTitle"></div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="mag_refrash_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50" selected="selected">50 ms</option>
                                <option value="100">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt i18n="sensorsScale"></dt>
                        <dd class="scale">
                            <select name="mag_scale">
                                <option value="0.5">0.5</option>
                                <option value="1" selected="selected">1</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                        <dt>Y:</dt>
                        <dd class="y">0</dd>
                        <dt>Z:</dt>
                        <dd class="z">0</dd>
                    </dl>
                </div>
                <svg id="mag">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
            </div>
        </div>
        <div class="wrapper altitude">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div>
                        <div class="title" i18n="sensorsAltitudeTitle"></div>
                        <div id="sensorsAltitudeHint" class="helpicon cf_tip" i18n_title="sensorsAltitudeHint"></div>
                    </div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="altitude_refresh_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50">50 ms</option>
                                <option value="100" selected="selected">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                    </dl>
                </div>

                <svg id="altitude">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
            </div>
        </div>
        <div class="wrapper sonar">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div class="title" i18n="sensorsSonarTitle"></div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="sonar_refresh_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50">50 ms</option>
                                <option value="100" selected="selected">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                    </dl>
                </div>
                <svg id="sonar">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
            </div>
        </div>
        <div class="wrapper debug">
            <div class="gui_box grey">
                <div class="plot_control">
                    <div class="title"><span i18n="sensorsDebugTitle"></span> 0</div>
                    <dl>
                        <dt i18n="sensorsRefresh"></dt>
                        <dd class="rate">
                            <select name="debug_refresh_rate">
                                <option value="10">10 ms</option>
                                <option value="20">20 ms</option>
                                <option value="30">30 ms</option>
                                <option value="40">40 ms</option>
                                <option value="50">50 ms</option>
                                <option value="100">100 ms</option>
                                <option value="250">250 ms</option>
                                <option value="500" selected="selected">500 ms</option>
                                <option value="1000">1000 ms</option>
                            </select>
                        </dd>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                    </dl>
                </div>
                <svg id="debug1">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
                <div class="plot_control">
                    <div class="title"><span i18n="sensorsDebugTitle"></span> 1</div>
                    <dl>
                        <dt>X:</dt>
                        <dd class="x">blue</dd>
                    </dl>
                </div>
                <svg id="debug2">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
                <div class="plot_control">
                    <div class="title"><span i18n="sensorsDebugTitle"></span> 2</div>
                    <dl>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                    </dl>
                </div>
                <svg id="debug3">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
                <div class="clear-both"></div>
                <div class="plot_control">
                    <div class="title"><span i18n="sensorsDebugTitle"></span> 3</div>
                    <dl>
                        <dt>X:</dt>
                        <dd class="x">0</dd>
                    </dl>
                </div>
                <svg id="debug4">
            <g class="grid x" transform="translate(40, 120)"></g>
            <g class="grid y" transform="translate(40, 10)"></g>
            <g class="data" transform="translate(41, 10)"></g>
            <g class="axis x" transform="translate(40, 120)"></g>
            <g class="axis y" transform="translate(40, 10)"></g>
        </svg>
            </div>
        </div>
    </div>
</div>
